{% load opensearch %}
<html>
<head>
  <script type="text/javascript" 
	  src="http://www.openlayers.org/dev/OpenLayers.js">
  </script>
  <script type="text/javascript">
    var feature_layer;
    var marker_layer;

    function init() {
        map = new OpenLayers.Map('opensearch_results_map');

        layer = new OpenLayers.Layer.WMS( "Base Layer",
                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
        map.addLayer(layer);

        feature_layer = new OpenLayers.Layer.GML("Results", "kml/?page={{page.number}}&{{query}}", {
                format: OpenLayers.Format.KML, 
                formatOptions: {
                  extractStyles: true, 
                  extractAttributes: true
                }
            });
        map.addLayer(feature_layer);

        map.zoomToMaxExtent();
    }

    function find_feature(fid) {
        for (i=0; i<feature_layer.features.length; i++) {
            if (feature_layer.features[i].fid == fid) {
                return feature_layer.features[i];
            }
        }
        return false;
    }
    function highlight_feature(fid) {
        feature = find_feature(fid);
        feature_layer.removeFeatures([feature]);
        feature.oldStyle = feature.style;
        feature.style = OpenLayers.Feature.Vector.style["select"];
        feature_layer.addFeatures([feature]);
    }
    function unhighlight_feature(fid) {
        feature = find_feature(fid);
        feature_layer.removeFeatures([feature]);
        feature.style = feature.oldStyle;
        feature_layer.addFeatures([feature]);
    }
  </script>
</head>
<body onLoad="init();">
{% opensearch_formats page %}
{% opensearch_results_map page %}
{% opensearch_results page %}
</body>
</html>
